import { useEffect, useRef } from "react";
const { Menu, getCurrentWindow } = window.require("@electron/remote");

export default function useContextMenu(contextMenuTmp, areaClass) {
  const currentEle = useRef(null);
  useEffect(() => {
    const areaEle = document.querySelector(areaClass);
    const contextMenu = Menu.buildFromTemplate(contextMenuTmp);

    const conetxtMenuHandle = (ev) => {
      currentEle.current = ev.target;
      contextMenu.popup({ window: getCurrentWindow })
    };

    areaEle.addEventListener("contextmenu", conetxtMenuHandle);
    return () => {
      areaEle.removeEventListener("contextmenu", conetxtMenuHandle);
    }
  });

  return currentEle;
}